<form class="form-inline" role="form" ng-controller="fbOptionsController">
	<span class="label label-default clickable" ng-click="expandAll()"><i class="glyphicon glyphglyphicon glyphicon-eye-open icon-white"></i>展开</span>
	<span class="label label-default clickable" ng-click="collapseAll()"><i class="glyphicon glyphglyphicon glyphicon-eye-close icon-white"></i>收缩</span>
	<span class="label label-default clickable" ng-click="changeShow()" ng-if="!showValue"><i class="glyphicon glyphglyphicon glyphicon-retweet icon-white"></i>切换值</span>
	<span class="label label-default clickable" ng-click="changeShow()" ng-if="showValue"><i class="glyphicon glyphglyphicon glyphicon-retweet icon-white"></i>切换内容</span>
	<h4 class="under-line"></h4>
	<div class="form-group" ng-if="!showValue"><label>选项内容</label></div>
	<div class="form-group" ng-if="showValue"><label>选项值</label></div>
	
	<div ui-tree id="tree-root">
      <ol ui-tree-nodes ng-model="component.properties.treeOptions">
        <li ng-repeat="item in component.properties.treeOptions" ng-init="level=1" ui-tree-node ng-include="'fb-tree-options.html'"></li>
      </ol>
    </div>
</form>

 <script type="text/ng-template" id="fb-tree-options.html">
	 <div class="tree-node tree-node-content">
			<div class="form-group">
		  		<i style="width: 14px;" class="glyphicon clickable" ng-if="item.children && item.children.length == 0" ></i>
		  		<i class="glyphicon clickable" ng-class ="{'glyphicon-chevron-right': collapsed,'glyphicon-chevron-down': !collapsed}" ng-if="item.children && item.children.length > 0" data-nodrag ng-click="toggle(this)"></i>
		   	</div>

    		<div class="form-group">
				<div class="input-group tree-option">
					<span class="input-group-addon" ng-if="component.arrayValue[level-1].value==$parent.$parent.item.value||level==1" 
						ng-init="component.arrayValue[level]=component.arrayValue[level-1].children.indexOf(component.arrayValue[level])>=0?component.arrayValue[level]:component.arrayValue[level-1].children[0]">
						<input type="radio" ng-model="component.arrayValue[level]"  ng-value="item" />
		        	</span>
			   	 	<input type="text" ng-if="!showValue" class="form-control" ng-model="item.text"
			    			ng-focus="selectOption(item)" ng-change="changeOption(item)" placeholder="选项内容">

			   		<input type="text" ng-if="showValue" class="form-control" ng-model="item.value" placeholder="选项值">
				</div>
		  	</div>
			<div class="form-group">
		  		<i class="glyphicon glyphicon-minus clickable" ng-click="removeTreeOption(this)"></i>
		  		<i class="glyphicon glyphicon-plus clickable" ng-click="addTreeOption(this)"></i>
		    	<i class="glyphicon glyphicon-move moveable"  ui-tree-handle></i>
		   	</div>
  	</div>
  	<ol ui-tree-nodes="" ng-model="item.children" ng-class="{hidden: collapsed}">
    	<li ng-repeat="item in item.children" ui-tree-node ng-include="'fb-tree-options.html'" ng-init="level=$parent.level+1">
    	</li>
 	</ol>
  </script>



		
		



